import React from 'react'

const Send = () => {
  const [status,SetStatus] = useState('send')
  let timer = 0
  const initTime = 60
  const [time,SetTime] = useState(initTime)
  const send = async()=>{
    SetStatus('aaa')
    timer = setInterval(()=>{
      SetTime(prevTime => {
        if(prevTime==1){
          clearInterval(timer)
          SetStatus('send')
          return initTime
        }
        return prevTime - 1
      })
    },1000)
    let result = await React.request.get('/business/auth')
    result.code?React.toast(result.msg, ''):React.toast(result.msg,'','fail')
  }
  if(status=='send')
  {
    return (
      <>
        <div><a onClick={send}>发送验证码</a></div>
      </>
    )
  }else{
    return (
      <>
        <div><a>{time}</a></div>
      </>
    )
  }
}
const Component = () =>
{
  //创建表单的对象结构
    const [form] = React.UI.Form.useForm()

    //初始化的个人资料数据
    let [business, SetBusiness] = useState({
        email: React.business.email,
        vercode: '',
    })
    const send = async ()=>{
      // let result = await React.request.get('/business/auth')
    }
    //表单提交方法
    const profile = async (values:any) => {
      console.log(values)
      let result = await React.request.post('/business/auth',values)
      result.code?React.toast(result.msg, 'back'):React.toast(result.msg,'','fail')
    }

  return (
    <>

      {/* 表单结构 */}
      <React.UI.Form
          name="profile"
          layout='horizontal'
          mode='card'
          form={form}
          initialValues={business}
          onFinish={profile}
          footer={<React.UI.Button block type='submit' color='primary' size='large'>提交验证</React.UI.Button>}
      >
          <React.UI.Form.Item name="email" label="邮箱" extra={<Send />}>
              <React.UI.Input placeholder="请输入邮箱" readOnly />
          </React.UI.Form.Item>

          <React.UI.Form.Item name="vercode" label="验证码" rules={[{ required: true }]}>
              <React.UI.Input placeholder="请输入验证码" />
          </React.UI.Form.Item>
      </React.UI.Form>
    </>
  )
}

export default Component